﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <#include "../inc/head.ftl"/>
    <@head/>
</head>
<body>
    <div id="wrapper">
        <#include "../inc/head_nav.ftl"/>
        <@head_nav/>
        <!--/. NAV TOP  -->
        <#include "../inc/nav.ftl"/>
        <@nav/>

        <!-- /. NAV SIDE  -->
        <div id="page-wrapper">
		  <div class="header"> 
                        <h1 class="page-header">
                            Empty Page <small>Create new page.</small>
                        </h1>
						<ol class="breadcrumb">
					  <li><a href="#">Home</a></li>
					  <li><a href="#">Empty</a></li>
					  <li class="active">Data</li>
					</ol> 
									
		</div>
            <div id="page-inner"> 
                <div class="row">
			     <div class="col-md-12">
        			<div class="panel panel-default">
        				<div class="panel-heading">
        				 服装种类管理
        				</div>        
							  
							<div class="panel-body"> 
								<div class="btn-group">
								   <table width="60%" class="table " >
			                        <tr>
                                        <td width="50px"><button id="addCategory" class="btn btn-success">新增</button></td>
                                        <td width="50px"><button id="editCategory" class="btn btn-info">编辑</button></td>
                                        <td width="50px"><button id="deleCategory" class="btn btn-danger">删除</button></td>

                                    </tr>
                                   </table>
                                    <a href="#" class="btn btn-primary">primary</a>
                                    <a href="#" class="btn btn-warning">warning</a>
                                </div>
                            </div>
                    </div>
                 </div>
                </div>
                <div class="row">
                    <div class="col-md-12">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                            </div>

                            <div class="panel-body">
                                <table width="100%" class="table table-striped table-bordered table-hover" id="list">
                                    <thead>
                                    <tr>
                                        <th>ID</th>
                                        <th>种类</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    </tbody>
                                </table>

                            </div>
                        </div>
                    </div>
                </div>
                <!-- /. ROW  -->
                <footer><p>Copyright &copy; 2016.Company name All rights reserved.<a target="_blank" href="http://www.cssmoban.com/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></p></footer>
            </div>

            <!-- /. PAGE INNER  -->
        </div>
        <!-- /. PAGE WRAPPER  -->
    </div>
    <!-- /. WRAPPER  -->
    </div>
    <!-- JS Scripts-->
    <#include "../inc/foot.ftl"/>
    <@foot/>
    <script>
        $(document).ready(function() {
            var table = $('#list').DataTable({
                "ajax": '/category/list',
                "language": {
                    "url": "/bootstrap/Chinese.json"
                },
                "columns": [
                    {"data": "id","visible" : false},
                    {"data": "categoryName"},
                ],
                responsive: true,
                select: true //datatables select 插件
            });

            $('#addCategory').click( function () {
                layer.open({  //layer弹出层
                    type: 2,
                    title:"新增品牌",
                    area: ['400px', '380px'],
                    fixed: false, //不固定
                    maxmin: true,
                    content: '/user/add',
                    end : function(index){
                        table.ajax.reload();
                    }
                });
            } );
            $('#editCategory').click( function () {
                var rowData =table.rows( { selected: true } ).data().toArray();
                if(rowData.length==1){
                    var id = rowData[0].id;
                    layer.open({
                        type: 2,
                        title:"修改品牌名",
                        area: ['400px', '300px'],
                        fixed: false, //不固定
                        maxmin: true,
                        content:'/user/edit?id='+id,
                        end : function(index){
                            table.ajax.reload();
                        }
                    });
                }else{
                    layer.msg('请选择一行!', {time: 1000, icon:7});
                }
            });

            $('#deleCategory').click( function () {
                var rowData =table.rows( { selected: true } ).data().toArray();
                if(rowData.length==1){
                    var id = rowData[0].id;
                    layer.open({
                        type: 2,
                        title:"删除品牌",
                        area: ['400px', '300px'],
                        fixed: false, //不固定
                        maxmin: true,
                        content:'/user/auth?id='+id,
                        end : function(index){
                            table.ajax.reload();
                        }
                    });
                }else{
                    layer.msg('请选择一行!', {time: 1000, icon:7});
                }
            });

        });

    </script>
</body>
</html>
